<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<img src="dog.png" />
		<div>
			<input id="big" type="button" value="放大" />
			<input id="small" type="button" value="缩小" />
		</div>
		
		<script type="text/javascript" src="jquery-1.11.3.js" ></script>
		<script type="text/javascript">
			$(function() {
				$("#big").bind("click", function() {
					//1、获得原始的宽和高
					var oldWidth = $("img").width();
					var oldHeight = $("img").height();
					//2. 计算放大后的宽和高
					//原宽/原高 = 新宽/新高;
            		//新高 = (新宽*原高)/原宽;
					var newWidth = oldWidth + 5;
					//var newHeight = (newWidth * oldHeight) / oldWidth;
					//2.设置新的宽和高
					$("img").width(newWidth);
					//$("img").height(newHeight);
				});
			});
		</script>
	</body>
</html>
